body{background-color: rgb(247,246,244);}

.top-title {
    height: 40px;
    line-height: 40px;
    position: fixed;
    border-bottom: 1px solid #e7e7e7;
    width: 100%;
    z-index: 999;
    background: #FFF;
    color: #000000;
}
.top-title .go-back {
    position: absolute;
    height: 40px;
    width: 40px;
}
.top-title .go-back svg {
    width: 20px;
    fill: currentColor;
    height: 40px;
    margin-left: 10px;
}
.top-title h4 {
    text-align: center;
    font-weight: normal;
    margin: 0;
    line-height: inherit;
    font-size: 16px;
}
.reward-block{
    position:relative;
    top:60px;
    padding:10px;
}
.reward-article{
    text-align:center;
}
.reward-article-head{
    display:inline-block;
    width:60px;
    height:60px;
    line-height:60px;
    background: #FFF;
    text-align:center;
    border-radius:50px;
}
.reward-article-head img{
    display:inline-block;
    max-height:100%;
    max-width:100%;
    width:auto;
    height:auto;
}
.reward-article-name{
    color: #000000;
    font-size:15px;
    font-weight:bold;
    padding:5px 0;
}
.reward-values{
    margin-top:15px;
    overflow:hidden;
}
.reward-values-item{
    float:left;
    width:30%;
    border:1px  solid #efefef;
    height:51px;
    line-height:51px;
    margin-bottom:5px;
    text-align:center;
    font-size:12px;
    color:#12b7f5;
    background-color:#FFF;
    border-radius: 3px;
}
.reward-values-item i{
    color:#12b7f5;
}
.reward-values-item-selected{
    border:1px  solid #12b7f5;
    background-color:#12b7f5;
    color:#FFF !important;
}
.reward-values-item-selected i{
    color:#FFF;
}
.reward-values-item i{
    font-size:20px;
    margin-right:3px;
    font-weight:bold;
}
.reward-values-item:not(:nth-child(3n+0)){
    margin-right:3.5%;
}

.reward-pay-type{
    margin-top:25px;
}

.reward-pay-type-item:last-child{
    border-bottom:1px solid #dad9d9;
}
.reward-pay-type-item{
    border-top:1px solid #dad9d9;
    padding:10px;
    color:#000;
    font-size:17px;
    overflow:hidden;
}
.reward-pay-type-item img{
    display:block;
    float:left;
    height:25px;
}
.reward-pay-type-item span{
    display:block;
    float:left;
    margin-left:13px;
    display:inline-block;
    height:25px;
    line-height:25px;
}
.reward-pay-type-item-radio {
    float:right;
}
.reward-pay-type-item-radio input[type="radio"] {

}
.reward-pay-type-item-radio input[type="radio"] + .reward-pay-type-item-radio-label:before {
    content: '';
    background: #f4f4f4;
    border-radius: 100%;
    border: 1px solid #b4b4b4;
    display: inline-block;
    width: 1.4em;
    height: 1.4em;
    position: relative;
    top: -0.2em;
    margin-right: 1em;
    vertical-align: top;
    cursor: pointer;
    text-align: center;
    -webkit-transition: all 250ms ease;
    transition: all 250ms ease;
}
.reward-pay-type-item-radio input[type="radio"]:checked + .reward-pay-type-item-radio-label:before {
    background-color: #3197EE;
    box-shadow: inset 0 0 0 4px #f4f4f4;
}
.reward-pay-type-item-radio input[type="radio"]:focus + .reward-pay-type-item-radio-label:before {
    outline: none;
    border-color: #3197EE;
}
.reward-pay-type-item-radio input[type="radio"]:disabled + .reward-pay-type-item-radio-label:before {
    box-shadow: inset 0 0 0 4px #f4f4f4;
    border-color: #b4b4b4;
    background: #b4b4b4;
}
.reward-pay-type-item-radio input[type="radio"] + .reward-pay-type-item-radio-label:empty:before {
    margin-right: 0;
}

.reward-bottom{
    margin-top:50px;
    text-align:center;
}
.reward-submit{
    border:1px solid #12b7f5;
    padding:10px;
    color:#FFF;
    width:95%;
    background-color: #12b7f5;
    border-radius:7px;
    font-size:16px;
}
input[type='radio']:checked:before, .icon-radio-checked:before{
    color: #12b7f5;
}